<form id="searchForm" class="init ccay-form">
	<div class="ccay-form-body">
		<ul>
			<li class="ccay-form-row">
				<samp class="i18n" i18nKey="ccay.common.label.name" ></samp>
				<span class="ccay-form-input"><input type="text" name="name" maxlength="20"/></span>	
			</li>
			<li class="ccay-form-row">
		  		<samp class="i18n" i18nKey="Sex"></samp>
		  		<span class='ccay-form-input'><input type="text" name="sex" id="sex1"/></span>
			</li>
			<li class="ccay-form-row">
		  		<samp class="i18n" i18nKey="Hobby"></samp>
		  		<span class='ccay-form-input'><input type="text" class="init ccay-combobox" name="hobby" service="ENUM:HobbyEnum"/></span>
			</li>
		</ul>
	</div>
	<div class="ccay-operate">
		<span id="btnSearch" class="ccay-button default" >
			<a class="ccay-icon search"></a>
			<label class="i18n" i18nKey="ccay.common.button.search"></label>
		</span>
		<span class="init button ccay-button reset" >
			<a class="ccay-icon reset"></a>
			<label class="i18n" i18nKey="ccay.common.button.reset"></label>
		</span>
	</div>
</form>	

 <!-- 数据表格 -->
  <div>
    <div id="htmlAreaGrid"></div>
  </div>
        

<script type="text/javascript">
$(function(){
	var gridOption1 = {
			height: 300,
			wrap: true,
			editMode: true,
			storageOp:{
				cache: true, // 是否缓存数据
				cacheKey: ["id"] // 缓存key
			},
		    columns: [
		        {columnType: "select"},
		 		{field: "name", width: 70, header: "ccay.common.label.name", freezeable:true, rule: {required: true}},
		 		{field: "sex", width:50, header: "sSex", type: 'bool', format: {isIcon: true},editorOp:{shortChecked:true}},
		 		{field: "age", width:50, header: "sAge", type: 'integer', rule: {range: [16, 80],required: true}},
		 		{field: "birthday", width:180, header: "sBirthday", type: 'datetime', format: {dateFormat:'yyyy/MM/dd hh:mm:ss'},content:"${#toUtcTime(data)}"},
		 		{field: "province", width:80, header: "sProvince", type: 'lookup', editorOp: {id: "comboProvince",afterTrigger:["city"]}, format: {code: "province", supportLang: true}},
		 		{field: "address", valueField: 'city', width:70, header: "sCity", type: 'enum', editorOp: {trigger:["province"],conf:{connector:"#comboProvince",lazyload:false,ajax:{url:'services/ccay/lookup/itemquery/list/city/{0}'}}}, format: {valueField:"itemCode",displayField:"itemName"}},
		 		{field: "tuition", width:100, header: "sPass", type: 'rate', format: {htmlView: true, section: [20, 50, 60]}},
		 		{field: "phone", width:100, header: "sTuition", type: 'currency', format:{fraction:2, flag:'￥[currency]'}, rule: {max: 9999999999, min: -9999999999}},
		 		{field: 'hobby', width:90, header: "sHobby", type: 'enum', format:{service:'ENUM:HobbyEnum'}}
		    ],
			ajax: {
			   	url: 'services/ccay/demo/student/list/page/${pageSize}/${curPage}/${orderBy}'
			},
		    operation: {
		    	search: {
		    		btn: '#btnSearch',
					panel: '#searchForm'
		    	}
		    }
		};
		$("#htmlAreaGrid").igrid(gridOption1);
	
	Ccay.UI.Selector.register('#searchForm',function(){
		return $("#htmlAreaGrid").manager().getSelectedRecords();
	},setSelected)
	
	function setSelected(input,e){
	}
})
</script>